var vm = new Vue({
	el:"#app",
	data:{
		productList:[],
		totalPrice:0,
		checkAllFlag:false,
		delFlag:false,
		delIndex:0
	},
	//局部过滤器
	filters:{
		formatMoney:function(value){
			return "¥"+value.toFixed(2);
		}
	},
	// 实例化创建完成
	mounted:function(){
		this.$nextTick(function(){ //保证 vm 就是 this
			this.cartView();
		});
	},
	// 定义方法
	methods:{
		//获取商品列表
		cartView:function(){
			let _this = this;
			vm.$http.get("data/cartData.json").then(function(res){
				_this.productList = res.data.result.list;
				_this.totalMoney = res.data.result.totalMoney;
			})
		},
		//加减商品数量改变商品总金额
		changeMoney:function(product,way){
			if(way>0){
				product.productQuantity++
			}else{
				product.productQuantity--;
				if(product.productQuantity == 0) product.productQuantity = 1
			}
			//如果该商品是被选中的 重新计算购物车总金额
			if(product.checked == true){
				this.calaTotalPrice();
			}
		},
		//选择商品
		selectedProduct:function(item){
			if(typeof item.checked == "undefined"){
				//item对象里没有checked的属性  在vue的item里全局注册checked属性
				// Vue.set(item,'checked',true);
			//	第二种方法  局部注册
				this.$set(item,'checked',true)
			}else{
				item.checked = !item.checked;
			}
			this.calaTotalPrice();
		},
		//全选和取消全选
		checkAll:function(){
			this.checkAllFlag = !this.checkAllFlag;
			var _this=this;
			if(this.checkAllFlag){
				this.productList.forEach(function(value,index){
					if(value.checked == undefined){
						_this.$set(value,'checked',true)
					}else{
						value.checked = true;
					}
				});
				this.calaTotalPrice();
			}else{
				this.productList.forEach(function(value,index){
					value.checked = false;
				});
				this.totalPrice = 0;
			}

		},
		//计算所选全部商品的总金额
		calaTotalPrice:function(){
			var total=0;
			this.productList.forEach(function(value,index){
				if(value.checked == true){
					total += value.productPrice*value.productQuantity
				}
			});
			this.totalPrice = total;
		},
		//删除功能
		deleateProduct:function(){
			//js数组删除  实际上应该是调用接口去删除
			this.productList.splice(this.delIndex,1);
			this.delFlag = false;
		},
		delConfirm:function(index){
			this.delFlag = true;
			this.delIndex = index;
		},
		jump:function(){
			if(this.totalPrice != 0){
				window.location.href = "http://localhost:63342/before/address.html";
			}else{
				alert("请先选择商品!")
			}
		}
	}
});
//全局过滤器 可以放到公用的js里 任意页面都可以用
Vue.filter('money',function(value,type){
	return type+value.toFixed(2);
});